<route lang="json5">
{
style: {
navigationBarTitleText: '帮助'
},
}
</route>

<template>
  <view class="help-container">
    <view class="help-title">常见问题</view>

    <view v-for="(item, index) in helpList" :key="index" class="help-item">
      <view class="question">{{ item.question }}</view>
      <view class="answer">{{ item.answer }}</view>
    </view>
  </view>
</template>

<script lang="ts" setup>
const helpList = [
  {
    question: '如何修改个人信息？',
    answer: '您可以在"个人信息"页面点击相应的选项进行修改。',
  },
  {
    question: '如何查看我的发布？',
    answer: '在"我的发布"页面可以查看您所有的发布内容，并进行编辑或删除操作。',
  },
  {
    question: '会员权益包含哪些内容？',
    answer: '会员权益包括但不限于：专属优惠、优先服务、增值服务等。详情请查看"会员权益"页面。',
  },
  {
    question: '如何联系客服？',
    answer: '您可以点击"在线客服"选项与我们的客服团队联系，或拨打页面底部的技术热线。',
  },
]
</script>

<style lang="scss" scoped>
.help-container {
  padding: 30rpx;
}

.help-title {
  font-size: 34rpx;
  font-weight: bold;
  margin-bottom: 40rpx;
  text-align: center;
}

.help-item {
  margin-bottom: 40rpx;
  background-color: #f8f8f8;
  border-radius: 12rpx;
  padding: 24rpx;
}

.question {
  font-size: 30rpx;
  font-weight: bold;
  color: #333;
  margin-bottom: 16rpx;
}

.answer {
  font-size: 28rpx;
  color: #666;
  line-height: 1.5;
}
</style>
